<script type="text/javascript">
	var url;
	function add(){
		$('#dlg').dialog('open').dialog('setTitle','Thêm Thông tin khách hàng');	
		$('#fm').form('clear');
		url = '/Khachhang/add';
	}
	function edit(){
		var row = $('#dg').datagrid('getSelected');
		$('#fm').form('clear');
		if (row){
			if(row.gender=='Nam')
			{
				$('#gender').combobox('setValue', 'Nam');
				}
			else
			{
				$('#gender').combobox('setValue', 'Nữ');
				}
			$('#dlg').dialog('open').dialog('setTitle','Sửa thông Khách hàng');
			$('#fm').form('load',row);
			url = '/Khachhang/updates/id/'+ row.id ;
		}else{
			$.messager.show({
				title:'Thông báo',
				msg:'Không có bản ghi nào được chọn!',
				timeout:5000,
				showType:'slide'
			});
		}
	}

	function del(){
		var row = $('#dg').datagrid('getSelected');
		if (row){
			$.messager.confirm('Thông báo','Bạn có chắc chắn muốn xóa?',function(r){
				if (r){
					$.post('/Khachhang/del',{id:row.id},function(result){
						if (result.success){
							$('#dg').datagrid('reload');	
						} else {
							$.messager.show({	
								title: 'Error',
								msg: result.msg
							});
						}
					},'json');
					$('#dg').datagrid('reload');
				}
			});
		}else{
			$.messager.show({
				title:'Thông báo',
				msg:'Không có bản ghi nào được chọn!',
				timeout:5000,
				showType:'slide'
			});
		}
	}

	function save(){
		$('#fm').form('submit',{
			url: url,
			onSubmit: function(){
				return $(this).form('validate');
			},
			success: function(result){
				var result = eval('('+result+')');
				if (result.success){
					$('#dlg').dialog('close');		
					$('#dg').datagrid('reload');	
				} else {
					$.messager.show({
						title: 'Error',
						msg: result.msg
					});
				}
			}
		});
	}
	
	function sear(){
		var name = $('#names').val();
		var stu = $('#sTu').datebox('getValue');  
		var sden = $('#sDen').datebox('getValue');
		var passport = $('#passports').val(); 
		
		if (name.length > 0 ||  stu.length > 0 
				|| sden.length > 0 || passport.length > 0 ){
			if(stu.length > 0)
				stu = stu.replace(new RegExp("/","gm"),"$");
			if(sden.length > 0)
				sden = sden.replace(new RegExp("/","gm"),"$");
			$('#dg').datagrid('options').url = '/Khachhang/sears/name/'+ name
			+'/passport/'+ passport +'/sTu/'+ stu +'/sDen/'+ sden ;

			
			}
		else{
			$('#dg').datagrid('options').url = '/Khachhang/json';
		}
		$('#dg').datagrid('reload');
	}
	
	$(function(){
			$('#dg').datagrid({
			  url: '/Khachhang/json',
			  view: detailview,
				detailFormatter:function(index,row){
					return '<div id="ddv-' + index + '" style="padding:=0px 0,whith="10"></div>';
				},
				onExpandRow: function(index,row){
					$('#ddv-'+index).panel({
						border:false,
						cache:false,
						href:'khachhang/orders/id/' + row.passport,
						onLoad:function(){
							$('#dg').datagrid('fixDetailRowHeight',index);
						}
					});
					$('#dg').datagrid('fixDetailRowHeight',index);
				}
			});
		});
		
		
		function printCT()
		{
			var row = $('#dg').datagrid('getSelected');
			if (row){
				window.location.href = "/baocao/danhsachno/cmt/"+ row.passport;
			}else{
				$.messager.show({
					title:'Thông báo',
					msg:'Không có bản ghi nào được chọn!',
					timeout:5000,
					showType:'slide'
				});
			}
		}
		function printDS()
		{
			window.location.href = "/baocao/danhsachno";
		}

</script>

<table id="dg" title="Danh sách khách hàng" style="width: 100%;"
	toolbar="#toolbar" pagination="true"  idField="Id" rownumbers="true"
	fitColumns="false" singleSelect="true" nowrap="true"
	data-options="border:false,fit:true">
		<thead>
			<tr>
				<th field="name" width="120" sortable="true">Họ tên</th>
				<th field="passport" width="120" sortable="true">Cmnd/passport</th>
                <th field="address" width="120" sortable="true">Địa chỉ</th>
                <th field="phone" width="120" sortable="true">Điện thoại</th>
                <th field="email" width="120" sortable="true">Email</th>
                <th field="company" width="120" sortable="true">Tên cơ quan</th>
                <th field="companyPhone" width="120" sortable="true">Điện thoại cơ quan</th>
                <th field="companyAddress" width="120" sortable="true">Điạ chỉ cơ quan</th>
				<th field="gender" width="120" sortable="true">Giới tính</th>
				<th field="id" align="center" data-options="hidden:true">id</th>
			</tr>
		</thead>
	</table>

<div id="toolbar" style="padding: 5px; height: auto;">
	<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="add()">Thêm</a>
	<a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="edit()">Sửa</a> 
	<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="del()">Xóa</a>
	<div style="float: right;">
		<a href="#" class="easyui-linkbutton" iconCls="icon-print" plain="true" onclick="printCT()">Hóa đơn nợ của 1 khách</a>
		<a href="#" class="easyui-linkbutton" iconCls="icon-print" plain="true" onclick="printDS()">Danh sách hóa đơn nợ</a>
	</div>
	<!-- Begin Search -->
	<table border="0" width="900" cellspacing="0" style="padding-top: 3px;"
		cellpadding="1" class="tblForm">
		<tr>
			<td>
				<span>Tên khách:</span>
			</td>
			<td>
				<input id="names" name="name" style="border: 1px solid #ccc">
			</td>
			<td><span>Số CMT:</span></td>
			<td>
				<input id="passports" name="passport" style="border: 1px solid #ccc">
			</td>
		   <td>
				<span>Từ:</span>
			</td>
			<td>
				<input id="sTu" name="sTu"  class="easyui-datebox" style="border: 1px solid #ccc">
			</td>
			<td><span>Đến:</span></td>
			<td>
				<input id="sDen" name="sDen" class="easyui-datebox" >
			</td>
			
			<td><a href="#" class="easyui-linkbutton" iconCls="icon-search"
				plain="true" onclick="sear()">Tìm kiếm</a></td>
		</tr>
		
	</table>
	<!-- End Search -->
</div>
	

<!-- Begin Form -->
<div id="dlg" class="easyui-dialog" style="width: 550px; height: 300px; 
	background: #e7e7ef; padding: 10px;"  closed="true" buttons="#dlg-buttons">
		<form id="fm" method="post" enctype="multipart/form-data" action = "/Khachhang/add">
		    <input type="hidden" name="id"  />
			<table border="0" width="100%" cellspacing="0" cellpadding="4" class="tblForm">
				<tr>
					<td>
						<div>Họ tên:</div> 
					</td>
					<td class="2Col">
						<input id="name" name="name" data-options="required:true" class="easyui-validatebox" style="width: 150px">
					</td>					
					<td>
						<div>Ngày sinh:</div> 
					</td>
					<td class="2Col">
						<input id="birthDate" name="birthDate" class="easyui-datebox"  style="width: 150px"></input>
					</td>
				</tr>
				<tr>
					<td>
						<div>Giới tính:</div> 
					</td>
					<td>
						<select id="gender" name="gender" data-options="required:true" class="easyui-combobox" style="width: 150px">
							<option value="Nam" >Nam</option>
							<option value="Nữ" >Nữ</option>
						</select>
					</td>
					
					<td>
						<div>CMND:</div> 
					</td>
					<td class="2Col">
						<input id="passport" name="passport" class="easyui-text" style="width: 150px">
					</td>
					
				</tr>
				<tr>
					<td>
						<div>Địa chỉ:</div> 
					</td>
					<td class="2Col">
						<input id="address" name="address" class="easyui-text" style="width: 150px;">
					</td>
					<td>
						<div>Điện thoại:</div> 
					</td>
					<td class="2Col">
						<input id="phone" name="phone" class="easyui-text" style="width: 150px;">
					</td>
					
				</tr>
				<tr>
					<td>
						<div>Email:</div> 
					</td>
					<td class="2Col">
						<input id="email" name="email" class="easyui-text" style="width: 150px;">
					</td>
					<td>
						<div>Tên cơ quan:</div> 
					</td>
					<td class="2Col">
						<input id="company" name="company" class="easyui-text" style="width: 150px;">
					</td>
					
				</tr>
				<tr>
					<td>
						<div>Điện thoại cơ quan:</div> 
					</td>
					<td class="2Col">
						<input id="companyPhone" name="companyPhone" class="easyui-text" style="width: 150px;">
					</td>
					<td>
						<div>Điạ chỉ cơ quan:</div> 
					</td>
					<td class="2Col">
						<input id="companyAddress" name="companyAddress" class="easyui-text" style="width: 150px;">
					</td>
					
				</tr>
			</table>					 
		</form>
</div>
<div id="dlg-buttons">
	<a href="#" class="easyui-linkbutton" iconCls="icon-ok" onclick="save()">Câp nhật</a> 
	<a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')">Hủy</a>
</div>
<!-- End From -->


